@(issue_id: Integer)
@import org.tapaha.util._;

<!DOCTYPE html>
<html>
  <head>
    <title>데헷</title>
    <meta name="viewport" content="user-scalable=yes, initial-scale=1.0, maximum-scale=5.0, minimum-scale=1.0, width=device-width, height=device-height" />
    
    <link rel="stylesheet" media="screen" href="@routes.Assets.at("stylesheets/bootstrap.min.css")">
    <link rel="stylesheet" media="screen" href="@routes.Assets.at("stylesheets/bootstrap-responsive.min.css")">
    <link rel="stylesheet" media="screen" href="@routes.Assets.at("stylesheets/docs.css")">
      
    <style>
      ul.comment-list {
        list-style:none !important;
        margin-left:5px !important;
      }
      ul.comment-list blockquote {
        clear:both;
        padding-left:10px !important;
        margin-bottom:10px !important;
      }
      ul.comment-list blockquote p {
        font-size:12px !important;
      }
    </style>

    <script src="@routes.Assets.at("javascripts/jquery-1.8.3.min.js")" type="text/javascript"></script>
    <script src="@routes.Assets.at("javascripts/bootstrap.min.js")" type="text/javascript"></script>
    <script src="@routes.Assets.at("javascripts/kakaoLink.js")" type="text/javascript"></script>

    <script type="text/javascript">
      var _gaq = _gaq || [];
      _gaq.push(['_setAccount', 'UA-36573141-1']);
      _gaq.push(['_trackPageview']);
      
      (function() {
        var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
        ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
        var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
      })();
    </script>
    
    <script>
      var isMobile = false;

      var HOST_ADDRESS = "http://dehet.net/";

      var issue = {
        article_no : 0,
        title : "",
        bbsid : "",
        cmrno : "",
        tcmt : "",
        splno : "",
        cmx : "", 
        npage : ""
      };
    
      var share_msg = {
        msg : "",
        url : "",
        appid : "dehet",
        appver : "0.1",
        appname : "데헷",
        link : null
      };

      var imgProportion = function($targetWidth, $targetHeight) {
        var DeviceWidth	= parseInt($(window).width()) - 30; //핸드폰의 가로 사이즈를 구합니다.
        
        var a1 = DeviceWidth * $targetHeight; //이미지 세로사이즈 계산식
        var newHeight = (a1 / $targetWidth); //이미지 세로사이즈 계산식
        var rtnSize	= new Array((DeviceWidth), newHeight);  //리사이징 된 이미지 사이즈 리턴
        return rtnSize;
      }
         
      var mobileKeyWords = new Array('iPhone', 'iPod', 'BlackBerry', 'Android', 'Windows CE', 'LG', 'MOT', 'SAMSUNG', 'SonyEricsson');
        for (var word in mobileKeyWords){
          if (navigator.userAgent.match(mobileKeyWords[word]) != null){
          isMobile = true;
        }
      }
      
      var setTrigger = function() {
        //카카오링크 트리거 등록
		$("a#share").click(function() {
//		    $.getJSON(
//		        "../shorten.json/" + encodeURIComponent(share_msg.url), 
//		        {}, 
//		        funciton(data) {
//		        	share_msg.url = data.short_url;
//		        	share_msg.link.execute();
//		    });
		  share_msg.link.execute();
		});
		  
		$("img").load(function() {
			var $this 	= $(this); //선택자를 지정합니다.
			var	sizeObj = getSize($this.css("width"), $this.css("height"));
		
			if(sizeObj.isBig === true) {
				$this.css({  //선택된 이미지에 CSS를 변경합니다.
					"width"  : sizeObj.width,
					"height" : sizeObj.height
				})
		    }
		 });
		  
		$("object").load(function() {
			var $this 	= $(this); //선택자를 지정합니다.
			var sizeObj = getSize($this.css("width"), $this.css("height"));
		
			if(sizeObj.isBig === true) {
				$this.css({  //선택된 이미지에 CSS를 변경합니다.
					"width"  : sizeObj.width,
					"height" : sizeObj.height
				})
		    }
		});
      };

      var getSize = function(thisWidth, thisHeight) {
        var ret = {
          isBig : false,
          width : 0,
          height : 0
        };
        
        ret.width = thisWidth;
        ret.height = thisHeight;
        
        var clientWidth = parseInt($(window).width()); //핸드폰의 가로사이즈를 구합니다.
        
        if(thisWidth > clientWidth) { //만약에 이미지 가로가 핸드폰 가로보다 길다면....
          var rtn 		= imgProportion(thisWidth, thisHeight); //Function 에 파라미터를 넘김니다
          var newWidth 	= rtn[0]; //Return 된 배열의 0번째 값을 읽어옵니다.
          var newHeight 	= rtn[1];  //Return 된 배열의 1번째 값을 읽어옵니다.
          
          ret.isBig = true;
          ret.width = newWidth;
          ret.height = newHeight;
        }
        
        return ret;
      }
         
      var getComment = function() {
        $.getJSON(
          "../comment.json/" + issue.bbsid + "/" + issue.cmrno + "/" + issue.npage + "/" + issue.splno + "/" + issue.cmx + "/" + issue.article_no,
          {},
          function(data) {
            for(var j in data.c) {
              $("ul.comment-list").append(
                $("<li>", {}).append(
                  $("<blockquote>", {
                    class : "pull-left"
                  }).append(
                    $("<p>", {}).html(data.c[j].memo)
                    ).append(
                      $("<small>", {}).html(data.c[j].name + "&nbsp;&nbsp;" + data.c[j].dt.substring(11))
                )) // </li>
              ); // <ul> append
            } //for
          } //callback function
        ); //getJSON             
      };
			
      $(function() {
        //트리거 등록 
        setTrigger();
        
        //컨텐츠 내용 로드
        $.getJSON(
          "../view.json/@issue_id",
          {},
          function(data) {
            issue.article_no = data.article_no;
            issue.title = data.title;
            
            $("div#content > h4").html(data.title);
            $("div#content > div").html(data.content.replace(/\&lt;/g,"<").replace(/\&gt;/g,">").replace(/\&quot;/g,'"').replace(/tapahac.cafe24.com/g,"dehet.net").replace(/scrawle.net/g,"dehet.net"));
            
            //resize movie
            var width = $("div#content > div").find("object").attr("width");
            var height = $("div#content > div").find("object").attr("height"); 
            
            var resizeObj = getSize(width, height);
            
            if(resizeObj.isBig === true) {
              $("div#content > div").find("object").attr({width : resizeObj.width, height : resizeObj.height});
              $("div#content > div").find("object embed").attr({width : resizeObj.width, height : resizeObj.height});
            }         
            
            if(isMobile == true) {
              $("ul.nav li").eq(1).find("a").attr("href","http://m.slrclub.com/bbs/vx2.php?id=free&no=" + issue.article_no);
            } else {
              $("ul.nav li").eq(1).find("a").attr("href","http://www.slrclub.com/bbs/vx2.php?id=free&no=" + issue.article_no);
            }
            
            share_msg.msg = issue.title;
            share_msg.url = HOST_ADDRESS + "view/@issue_id";
            share_msg.link = new com.kakao.talk.KakaoLink(share_msg.msg, share_msg.url, share_msg.appid, share_msg.appver, share_msg.appname);
                        
            $.get(
              "../comment.html/" + encodeURIComponent("http://www.slrclub.com/bbs/vx2.php?id=free&no=" + issue.article_no),
              {},
              function(data) {
                while(data.indexOf("<script") != -1) {
                  data = data.replace(/<script[^>]*>[\s\S]*?<\/script>/gi, '');
                }
                while(data.indexOf("<link") != -1) {
                  data = data.replace(/<link[^>]*>[\s\S]*?/gi, '');
                }
                $("div#proxy").html(data);
                
                issue.bbsid = $("div#proxy div.comment_box").attr("data-bbsid");
                issue.cmrno = $("div#proxy div.comment_box").attr("data-cmrno");
                issue.tcmt = $("div#proxy div.comment_box").attr("data-tcmt");
                issue.splno = $("div#proxy div.comment_box").attr("data-splno");
                issue.cmx = $("div#proxy div.comment_box").attr("data-cmx");
                issue.npage = $("div#proxy div.comment_box").attr("data-npage");
                
                try {
                  getComment();
                } catch(err) {
                  alert(err.message);
                }
          }); //get
        }); //getJSON
            
      }); //dom ready

		</script>
	</head>

	<body data-spy="scroll" data-target=".bs-docs-sidebar">
		<div class="navbar navbar-inverse navbar-fixed-top">
		  <div class="navbar-inner">
		  	<div class="container">
          		<button type="button" class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
            		<span class="icon-bar"></span>
            		<span class="icon-bar"></span>
            		<span class="icon-bar"></span>
          		</button>
          		<a class="brand" href="../">데헷</a>
          		<div class="nav-collapse collapse">
            		<ul class="nav">
                    <li class="active"> <a href="../" style="color:#dfdfdf"><i class="icon-white icon-home"></i>&nbsp;&nbsp;Home</a> </li>
              			<li class=""> <a href="#" style="color:#dfdfdf"><i class="icon-white icon-list-alt"></i>&nbsp;&nbsp;원본글</a> </li>
                    <li class=""> <a href="javascript:;" style="color:#dfdfdf" id="share"><i class="icon-white icon-share"></i>&nbsp;&nbsp;공유</a> </li>
            		</ul>
          		</div>
		  	</div>
		  </div>
		</div>
		
		<div class="container" id="content">
		  <h4 class="text-error"></h4>
		  <div class="">
		  </div>
		</div>
    <hr class="soften" style="margin:15px 0">
    <div class="container" id="comment">
      <h5><i class="icon-comment"></i>&nbsp;&nbsp;댓글</h5>
      <ul class="comment-list"></ul>
    </div>
	 
		<footer class="footer">
			<div class="container">
		  		<p>SCrawle : </p>
            	<ul class="footer-links">
              		<li><a href="mailto:scrawle7 at gmail.com">Contacts</a></li>
              		<li class="muted">&middot;</li>
              		<li><a href="./changelog">Changelog</a></li>
            	</ul>
           </div>
		</footer>
	<div id="proxy" style="display:none;"></div>
	</body>
</html>
